﻿<!--头部文件-->
<include file="Public/header"/>
<!--头部文件结束-->


<div class="wrapper">
    <!--左侧菜单栏-->
    <include file="Public/menu"/>
    <!--左侧菜单栏结束-->

    <div class="main-panel">
        <nav class="navbar navbar-default">
            <div class="container-fluid">
                <div class="navbar-minimize">
                    <button id="minimizeSidebar" class="btn btn-warning btn-fill btn-round btn-icon">
                        <i class="fa fa-ellipsis-v visible-on-sidebar-regular"></i>
                        <i class="fa fa-navicon visible-on-sidebar-mini"></i>
                    </button>
                </div>
                <div class="navbar-header">
                    <a class="navbar-brand" href="#">编辑链接</a>
                </div>
            </div>
        </nav>



        <div class="content">
            <div class="container-fluid">

                <div class="row">
                    <div class="col-md-12">
                        <div class="card">
                            <form id="logo_upload" class="form-horizontal" action="__APP__/Blogroll/edit_form/id/{$blogroll.id}.html" method="post" enctype="multipart/form-data">
                                <div class="content">
                                    <legend>编辑链接</legend>
                                    <fieldset>
                                        <div class="form-group" >
                                            <label class="col-sm-2 control-label">logo图</label>
                                            <div class="col-sm-6" style="width:10%">
                                                <input onclick="$('#select_img').click()" type="button" value="选择图片" style="width:100%;height:35px;background:white;border:1px solid #ccc">
                                                <input name="logo_img" id="select_img" type="file" style="display:none">
                                            </div>
                                            <div class="col-sm-6"><code style="margin-top:4px">请使用jpg、png、gif格式的图片,且不能超过2M.</code></div>
                                        </div>
                                    </fieldset>

                                    <fieldset>
                                        <div class="form-group" style="height:150px;line-height:150px;">
                                            <label class="col-sm-2 control-label">图片预览</label>
                                            <div class="col-sm-6">
                                                <img id="show_img" src="__ROOT__/{$blogroll.path}" style="width:250px;height:150px;">
                                            </div>
                                        </div>
                                    </fieldset>

                                    <fieldset>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label">公司名称</label>
                                            <div class="col-sm-6">
                                                <input class="form-control" id="name" type="text" name="name" value="{$blogroll.name}" number="true" style="width:110%;" onkeyup="value=value.replace(/[^\S]+/g,'')"/>
                                            </div>
                                        </div>
                                    </fieldset>

                                    <fieldset>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label">公司链接</label>
                                            <div class="col-sm-6">
                                                <input class="form-control" id="url" type="text" name="url" placeholder="链接地址请以 http://或https://开头，如 http://www.baidu.com" value="{$blogroll.url}" number="true" style="width:110%;" onkeyup="value=value.replace(/[^\S]+/g,'')"/>
                                            </div>
                                        </div>
                                    </fieldset>

                                    <fieldset>
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label"></label>
                                            <div class="col-sm-6">
                                                <span id="logo_upload_success"></span>
                                            </div>
                                        </div>
                                    </fieldset>
                                </div>
                                <div class="footer text-left">
                                    <button id="button_yes" type="button" class="btn btn-info btn-fill">提交</button>
                                    <button id="button_no" type="button" class="btn btn-info btn-fill" onclick="window.location.href='__APP__/Blogroll/index.html'">返回</button>
                                </div>
                                <br/>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!--底部文件-->
        <include file="Public/footer"/>
        <!--底部文件结束-->


    </div>
</div>

</body>

<!--   Core JS Files and PerfectScrollbar library inside jquery.ui   -->
<script src="__ROOT__/public/js/jquery.min.js" type="text/javascript"></script>
<script src="__ROOT__/public/js/jquery-ui.min.js" type="text/javascript"></script>
<script src="__ROOT__/public/js/bootstrap.min.js" type="text/javascript"></script>


<!--  Forms Validations Plugin -->
<script src="__ROOT__/public/js/jquery.validate.min.js"></script>

<!--  Plugin for Date Time Picker and Full Calendar Plugin-->
<script src="__ROOT__/public/js/moment.min.js"></script>

<!--  Date Time Picker Plugin is included in this js file -->
<script src="__ROOT__/public/js/bootstrap-datetimepicker.js"></script>

<!--  Select Picker Plugin -->
<script src="__ROOT__/public/js/bootstrap-selectpicker.js"></script>

<!--  Checkbox, Radio, Switch and Tags Input Plugins -->
<script src="__ROOT__/public/js/bootstrap-checkbox-radio-switch-tags.js"></script>

<!--  Charts Plugin -->
<script src="__ROOT__/public/js/chartist.min.js"></script>

<!--  Notifications Plugin    -->
<script src="__ROOT__/public/js/bootstrap-notify.js"></script>

<!-- Sweet Alert 2 plugin -->
<script src="__ROOT__/public/js/sweetalert2.js"></script>

<!-- Vector Map plugin -->
<script src="__ROOT__/public/js/jquery-jvectormap.js"></script>

<!--  Google Maps Plugin    -->
<script src="__ROOT__/public/js/aa743e8f448a4792bad10d201a7080f6.js"></script>

<!-- Wizard Plugin    -->
<script src="__ROOT__/public/js/jquery.bootstrap.wizard.min.js"></script>

<!--  Bootstrap Table Plugin    -->
<script src="__ROOT__/public/js/bootstrap-table.js"></script>

<!--  Plugin for DataTables.net  -->
<script src="__ROOT__/public/js/jquery.datatables.js"></script>

<!--  Full Calendar Plugin    -->
<script src="__ROOT__/public/js/fullcalendar.min.js"></script>

<!-- Light Bootstrap Dashboard Core javascript and methods -->
<script src="__ROOT__/public/js/light-bootstrap-dashboard.js"></script>

<!--   Sharrre Library    -->
<script src="__ROOT__/public/js/jquery.sharrre.js"></script>

<!-- Light Bootstrap Dashboard DEMO methods, don't include it in your project! -->
<script src="__ROOT__/public/js/demo.js"></script>
<script src="__ROOT__/public/js/new_js.js"></script>

<script>
    $('li.Blogroll').addClass('active');

    $('.content input').mouseover(function(){
        $(this).css('background','#ccc');
    })
    $('.content input').mouseout(function(){
        $(this).css('background','white');
    })

    $('#button_yes').click(function(){
        if($('#select_img').val()=='' && $('#show_img').attr('src')!='__ROOT__/{$blogroll.path}'){
            One_button('请选择图片');
        }else if($('#name').val()==''){
            One_button('请输入公司名称');
        }else if($('#url').val()==''){
            One_button('请填入链接');
        }else{
            edit();
            $('#logo_upload').submit();
        }
    });

    $('#select_img').change(function(){
        if($('#select_img').val()==''){
            $('#show_img').css('display','none');
        }
    })
    //图片上传预览
    $(function(){
        $('#select_img').on('change',function(){
            var imgfile =this.files[0];
            var fr= new FileReader();
            fr.onload=function(){
                $('#show_img').attr('src',fr.result).css('display','');
                $('#show_img').css({"width":"250px","height":"150px"});
            }
            fr.readAsDataURL(imgfile);
        });
    })

    /* 数据库修改减少优化 */
    function edit(){
        if($('#show_img').attr('src')=='__ROOT__/{$blogroll.path}'){
            $('#select_img').removeAttr('name');
        }
        if($('#name').val()=="{$blogroll.name}"){
            $('#name').removeAttr('name');
        }
        if($('#url').val()=="{$blogroll.url}"){
            $('#url').removeAttr('name');
        }
    }
</script>
</html>
